<template>
	<div>
		<router-view :key="key"></router-view>

		<div class="weui-flex weui-fixed-btm nav">
			<van-tabbar v-model="active" route>
				<van-tabbar-item to="/">
					<span>首页</span>
					<img slot="icon" slot-scope="props" :src="props.active ? icon.active : icon.normal">
				</van-tabbar-item>
				<!-- <van-tabbar-item to="/Transaction">
					<span>交易</span>
					<img slot="icon" slot-scope="props" :src="props.active ? icon.active2 : icon.normal2">
				</van-tabbar-item>
				<van-tabbar-item to="/Otc">
					<span>OTC</span>
					<img slot="icon" slot-scope="props" :src="props.active ? icon.active3 : icon.normal3">
				</van-tabbar-item> -->
				<van-tabbar-item to="/find">
					<span>发现</span>
					<img slot="icon" slot-scope="props" :src="props.active ? icon.active3 : icon.normal3">
				</van-tabbar-item>
				<van-tabbar-item to="/Assets">
					<span>我的</span>
					<img slot="icon" slot-scope="props" :src="props.active ? icon.active4 : icon.normal4">
				</van-tabbar-item>
			</van-tabbar>
		</div>
	</div>
</template>

<script>
	import { Toast, Dialog, Notify } from 'vant';
	import { mine, safety } from './../utils/api';
	import { base64 } from 'vux';
	import { encryptDes, decryptDes } from './../utils/des'
	let _this;
	export default {
		data() {
			return {
				mydate: '', // 当前的年月
				active: 0,
				icon: {
					// normal: require('./../assets/images/icon-home.png'),
					// active: require('./../assets/images/icon-home2.png'),
					// normal2: require('./../assets/images/icon-transaction.png'),
					// active2: require('./../assets/images/icon-transaction2.png'),
					// normal3: require('./../assets/images/icon-otc.png'),
					// active3: require('./../assets/images/icon-otc2.png'),
					// normal4: require('./../assets/images/icon-my.png'),
					// active4: require('./../assets/images/icon-my2.png'),
					normal: require('./../assets/images/icon-home.png'),
					active: require('./../assets/images/icon-home2.png'),
					// normal2: require('./../assets/images/icon-transaction.png'),
					// active2: require('./../assets/images/icon-transaction2.png'),
					normal3: require('./../assets/images/icon-find.png'),
					active3: require('./../assets/images/icon-find2.png'),
					normal4: require('./../assets/images/icon-my.png'),
					active4: require('./../assets/images/icon-my2.png'),
				}
			}
		},
		beforeCreate() {
			_this = this;
		},
		computed: {
			key() {
				return this.$route.name !== undefined ? this.$route.name + new Date() : this.$route + new Date();
			}
		},
		mounted() {

		},
		methods: {

		}
	}
</script>

<style lang="less" scoped>
	/deep/.van-tabbar {
		background: #212636;
	}
	
	/deep/.van-tabbar-item--active {
		color: #525fd6;
	}
	
	/deep/.van-hairline--top-bottom::after {
		border-width: 0;
	}
	
	.vux-1px-t:before {
		border: none;
	}
</style>